<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <template th:replace="common/header"></template>
</head>
<body>

<nav class="navbar navbar-default">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">廉洁西昌</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="/admin">举报管理 <span class="sr-only">(current)</span></a></li>
                <li><a href="/admin/weixin-article">微信图文管理</a></li>
            </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>

<main class="container-fluid">
    <table id="myTable" class="table table-hover table-bordered table-condensed text-center">
        <thead>
        <tr>
            <td width="40">ID</td>
            <td>举报对象</td>
            <td>举报内容</td>
            <td>手机号</td>
            <td>查看状态</td>
            <td>核审状态</td>
            <td>举报时间</td>
            <td>核审时间</td>
            <td width="150">操作</td>
        </tr>
        </thead>

    </table>

    <!--<div class="auto-refresh">-->
        <!--<label>-->
            <!--<input type="checkbox" id="autoRefresh"> 自动刷新列表-->
        <!--</label>-->
    <!--</div>-->

</main>
<template th:replace="common/footer"></template>

<script>
    $(document).ready(function () {
        dataTable = $('#myTable').DataTable({
            serverSide: true,
            order: [ 0, "desc" ],
            stateSave: true,
            ajax: {
                url: 'admin/api/report'
            },
            columns: [
                {
                    data: 'id'
                }, {
                    data: 'titleName'
                }, {
                    data: 'content'
                }, {
                    data: 'phone'
                },  {
                    data: 'view',
                    render: function (data, type, row, meta) {
                        var html = "";
                        switch (data) {
                            case 0:
                                html = '<span class="text-primary">未查看</span>';
                                break;
                            case 1:
                                html = '<span class="text-success">已查看</span>';
                                break;
                            default:
                                html = '<span class="text-info">未知状态</span>';
                                break;
                        }
                        return html;
                    }
                },{
                    data: 'status',
                    render: function (data, type, row, meta) {
                        var html = "";
                        switch (data) {
                            case -1:
                                html = '<span class="text-danger">已驳回</span>';
                                break;
                            case 0:
                                html = '<span class="text-primary">待核审</span>';
                                break;
                            case 1:
                                html = '<span class="text-success">已通过</span>';
                                break;
                            default:
                                html = '<span class="text-info">未知状态</span>';
                                break;
                        }
                        return html;
                    }
                }, {
                    data: 'createTime'
                }, {
                    data: 'updateTime'
                }, {
                    data: 'id',
                    render: function (data, type, row, meta) {
                        var html='';
                        html+='<button class="btn btn-primary btn-xs" onclick="view(' + data + ')">查看详情</button> ';
//                        html+='<button class="btn btn-warning btn-xs" onclick="del(' + data + ')">核审</button> ';
                        html+='<button class="btn btn-danger btn-xs" onclick="del(' + data + ')">删除</button> ';
                        return html
                    }
                }

            ]
        });
    });

    var view = function (id) {
        layer.open({
            type: 2,
            area: ['640px', '560px'],
            // maxmin: true, //开启最大化最小化按钮
            content: "/admin/report/" + id
        })
    };

    var del = function (id) {
        layer.confirm('确认删除本条举报？', {
            btn: ['确认', '取消'] //按钮
        }, function () {
            $.ajax({
                type: 'delete',
                url: '/admin/api/report/' + id,
                success: function (result) {
                    layer.alert(result.msg, function (index) {
                        dataTable.ajax.reload();
                        layer.close(index)
                    })
                }
            });
        })
    };

</script>
</body>
</html>
